<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="jt" uri="http://www.jsoft.org/tags/jsoft"%>
<%@ taglib prefix="jh" uri="http://www.jsoft.org/tags/jsoft-html"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
	if(path!=null&&path.equals("/")){
	   path="";
	} 
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>系统角色事件维护</title>
		<link href="<%=basePath%>admin/styles/default.css" rel="stylesheet"
			type="text/css" />
		<link rel="StyleSheet" href="<%=basePath%>admin/manager/dtree/dtree.css" type="text/css" />
		<script type="text/javascript" src="<%=basePath%>admin/manager/dtree/dtree.js"></script>
		<script type="text/javascript">
        function frameHeight() {
        	var height = (window.innerHeight) ? window.innerHeight : (document.documentElement && document.documentElement.clientHeight) ? document.documentElement.clientHeight : document.body.offsetHeight;
			return height;
        }
        
        window.onload = function(){frameHeightSet();}
		window.onresize = function(){frameHeightSet();}
		
		function frameHeightSet() {
			var height = frameHeight();
        	if (height<=300) {
        		height = 300;
        	}
        	document.getElementById("linkTable").style.height = height-128+"px";
        	document.getElementById("roleDiv").style.height = height-128+"px";
		}
		</script>
	</head>

	<body>
		<div class="title">
			<h2>
				系统角色事件维护
			</h2>
		</div>
		<div id="container">
			<!-- table -->
			<form action="<%=basePath%>manager/event/roleEventSave.do" method="post">
				<table width="100%" cellpadding="2" cellspacing="1"
					bgcolor="#DDDDDD">
					<tr bgcolor="#FFFFFF">
						<td nowrap="nowrap" width="220">
							系统角色列表：
							<a href="<%=basePath%>manager/event/roleEvent.do">刷新</a>
						</td>
						<td>
							系统事件功能树：
							<c:if test="${requestScope.selectRole ne null}">
								<a href="<%=basePath%>manager/event/roleEvent.do?id=${requestScope.selectRole.id}">刷新</a>
								<font color="red">
								<b><c:out value="${requestScope.selectRole.name}"></c:out></b>
								</font>
							</c:if>
							<input type="hidden" name="id" value="${requestScope.selectRole.id}" />
							<font color="red">
							${requestScope.saveMsg}
							</font>
						</td>
					</tr>
					<tr bgcolor="#FFFFFF">
						<td valign="top">
							<div id="roleDiv" style="overflow: auto;">
								<c:forEach items="${requestScope.roleList}" var="role" varStatus="status">
								<div style="padding-left: 4px;margin-bottom: 3px;margin-top: 3px;">
									<c:choose>
									<c:when test="${requestScope.selectRole.id eq role.id}">
										<c:out value="${status.index + 1}"/>)
										<font color="red"><b>${role.name}</b></font>
									</c:when>
									<c:otherwise>
										<c:out value="${status.index + 1}"/>)
										<a href="<%=basePath%>manager/event/roleEvent.do?id=${role.id}">${role.name}</a>
									</c:otherwise>
									</c:choose>
								</div>
								</c:forEach>
							</div>
						</td>
						<td valign="top" align="left">
							<!-- DTree -->
							<div>
								<a href="javascript: dd.openAll();">open all</a> |
								<a href="javascript: dd.closeAll();">close all</a>
							</div>
							<div id="linkTable" style="overflow: auto;">
								<div class="dtree">
									<script type="text/javascript">
									<!--
							
									dd = new dTree('dd','<%=basePath%>admin/manager/dtree/');
							
									dd.add(0,-1, '<b>System operation menu</b>', '');
									<c:forEach items="${requestScope.eventList}" var="event">
									checked = '';
									<c:forEach items="${requestScope.selectRole.events}" var="selectEvent">
										<c:if test="${event.id eq selectEvent.id}">
											checked = 'checked="checked"';
										</c:if>
									</c:forEach>
									dd.add(${event.id},${event.pid}, '<input type="checkbox" name="check" value="${event.id}" class="${event.pid}" id="ch${event.id}" onClick="checkStatus(${event.id},this)" '+checked+' style="width:13px;height:13px;vertical-align: middle;">${event.name}&nbsp;<font color="blue">${event.href}</font>&nbsp;${event.target}&nbsp;(${event.id},${event.pid})');
									</c:forEach>
									
									document.write(dd);
									
									function checkStatus(no,chkBox){
									    checkPar(chkBox);//当子目录选中时,父目录也选中
									    var chks = document.getElementsByTagName('input');//得到所有input
									    for(var i=0;i <chks.length;i++){
									        if(chks[i].name.toLowerCase() == 'check'){//得到所名为check的input
									            if(chks[i].className == no){//ID等于传进父目录ID时
									                chks[i].checked = chkBox.checked;//保持选中状态和父目录一致
									                checkStatus(chks[i].value,chks[i]);//递归保持所有的子目录选中
									            }
									        }
									    }
									}
									function checkPar(chkBox) {
									    if(chkBox.name.toLowerCase() == 'check' && chkBox.checked && chkBox.className != 0) {//判断本单击为选中,并且不是根目录,则选中父	目录
									        var chkObject = document.getElementById("ch"+chkBox.className);//得到父目录对象
									        chkObject.checked=true;
									        checkPar(chkObject);
									    }
									}
									//-->
									</script>
								</div>
							</div>
							<!-- End -->
						</td>
					</tr>
					<tr bgcolor="#FFFFFF">
						<td>
							&nbsp;
						</td>
						<td>
							<input type="submit" value="保存/修改" class="button" />
							<input type="reset" value="重置" class="button" />
						</td>
					</tr>
				</table>
			</form>
		</div>
	</body>
</html>
